<template>
	<view class="activity-box">
			<view class="left">
				<!-- <text class="activity-name">{{detail.promotion.sDesName}}</text> -->
				<text class="price">￥{{detail.fSalePrice}}</text>
				<text class="m-price">¥{{detail.fMarkPrice}}</text>
			</view>
			<view class="right">
				<text class="activity-desc" v-if="detail.promotion">距结束{{times}}</text>
				<view class="stock-box">
					<text class="total-num">
						<text class="now-num" :style="{width:detail.lInventoryCount/(detail.lInventoryCount+detail.iSales)*100+'%'}"></text>
					</text>
					<text class="justRemnant">仅剩{{detail.lInventoryCount}}件</text>
				</view>
			</view>
		</view>
</template>

<script>
    export default {
        name: "",
        components:{
            
        },
        data(){
            return {
                detail:{},
				timer:null,
				times:"--天--:--:--",
            }
        },
		methods:{
			setDatas(val){
				this.detail = val
				if(this.detail.promotion){
					this.timeDown()
				}
				
			},
			timeDown() { // 倒计时
			
				clearInterval(this.timer);
				var starttime = new Date(this.detail.promotion.pStartDate.replace(/-/g, "/")) / 1000;
				var nowDate = Math.round(new Date() / 1000); // 当前时间
				//var endtime = Number(this.initActiveMsgObj.end_time); 
				var endtime = new Date(this.detail.promotion.pEndDate.replace(/-/g, "/")) / 1000;
				// endtime = Math.round(new Date('2019/7/10 14:56:00') / 1000); + 60;
				if (endtime < nowDate) {
					return
				}
			
			
				var totalSeconds = parseInt((endtime - nowDate)); // 相差的总秒数
				//天数
				var days = Math.floor(totalSeconds / (60 * 60 * 24));
				//取模（余数）
				var modulo = totalSeconds % (60 * 60 * 24);
				//小时数
				var hours = Math.floor(modulo / (60 * 60));
				hours = hours < 10 ? ('0' + hours) : hours;
				modulo = modulo % (60 * 60);
				//分钟
				var minutes = Math.floor(modulo / 60);
				minutes = minutes < 10 ? '0' + minutes : minutes;
				// console.log(minutes)
				//秒
				var seconds = modulo % 60;
				seconds = seconds < 10 ? '0' + seconds : seconds;
				// console.log(seconds);
				//输出到页面
				this.times = days + '天' +hours + ':' + minutes + ':' + seconds;
				// console.log(days + "天" + hours + "时" + minutes + "分");
				//if(totalSeconds <= 0){
				if (totalSeconds <= 60) {
					clearInterval(this.timer);
					// window.location.reload()
				} else {
					this.timer = setInterval(this.timeDown, 1000);
				}
			},
		}
      

    }
</script>

<style scoped lang="less">
	.activity-box{
	
		height:161upx;
		background:rgba(240,64,111,1);
		padding: 31upx 20upx;
		display: flex;
		justify-content: space-between;
		align-items: center;
		.left{
			.activity-name{
				display: block;
				font-size:27upx;
				font-family:Microsoft YaHei;
				font-weight:400;
				color:rgba(255,255,255,1);
				text-align: left;
			}
			.price{
				font-size:51upx;
				font-family:Microsoft YaHei;
				font-weight:bold;
				color:rgba(255,255,255,1);
				text-align: left;
				text{
					font-size: 22rpx;
				}
			}
			.m-price{
				margin:0 12upx;
				color: #fff;
				text-decoration: line-through;
				font-size: 27upx;
			}
		}
		.right{
			flex: 1;
			text-align: right;
			
			.activity-desc{
				display: block;
				font-size:25upx;
				font-family:Microsoft YaHei;
				font-weight:400;
				color:rgba(255,255,255,1);
				.dso{
					width:28rpx;
					height:28rpx;
					background:rgba(255,255,255,1);
					border-radius:14rpx;
					text-align: center;
					font-size:18rpx;
					font-family:Microsoft YaHei;
					font-weight:400;
					color:rgba(240,64,111,1);
					line-height: 28rpx;
					display: inline-block;
					margin-left: 8rpx;
				}
			}
			.stock-box{
				display: inline-flex;
				align-items: center;
				justify-content: flex-end;
				.total-num{
					width:100upx;
					height:5upx;
					background:rgba(209,55,96,1);
					border-radius:3upx;
					position: relative;
					margin-right: 8upx;
					.now-num{
						position: absolute;
						width: 0;
						height: 100%;
						left: 0;
						top: 0;
						background: #fff;
					}
				}
				.justRemnant{
					font-size:25upx;
					font-family:Microsoft YaHei;
					font-weight:400;
					color:rgba(255,255,255,1);
				}
			}
		}
		
	}
</style>
